<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    img {
        width: 100px;
        height: 100px;
    }
    td{
        text-align: center;
    }
</style>
<table border="1px" style="width: 700px;">
    <thead>
        <tr>
            <th>书名</th>
            <th>作者</th>
            <th>图片</th>
            <th>介绍</th>
            <th>操作</th>
        </tr>
    </thead>
    <tbody>

    </tbody>
</table>

<body>
    <script>
        var tbody = document.querySelector('tbody')
        var xhr = new XMLHttpRequest()
        xhr.open('get', 'http://127.0.0.1:3000/userll')
        xhr.send()
        xhr.onload = () => {
            var a = JSON.parse(xhr.response).data.qic
            //    console.log(a);
            a.forEach(item => {
                tbody.innerHTML += `
             <tr>
            <td>${item.name}</td>
            <td>${item.Author}</td>
            <td><img src="${item.img}" alt=""></td>
            <td>${item.Introduction}</td>
            <td><button>删除</button></td>
        </tr>`
            })
        }
        xhr.onerror = (e) => {
            console.log(e)
        }
    </script>
</body>

</html>